<template>
	<el-select class="online-tree-select" size="small" style="width: 100%;" v-show="isShow" v-model="mineStatus"
		placeholder="请选择" :multiple="isMultiple" collapse-tags>
		<el-option style="height: auto" v-model="option_temp">
			<el-tree v-model="treeModelValue" :default-checked-keys="checkedKeys" :key="treeKey" size="mini"
				:expand-on-click-node="true" :check-on-click-node="true" :check-strictly="true" :data="treeData"
				:default-expand-all="false" :show-checkbox="false" check-strictly node-key="id" ref="tree"
				highlight-current :props="defaultProps" @check-change="handleCheckChange">
			</el-tree>
		</el-option>
	</el-select>
</template>
<script>
	export default {
		//由于手机端不支持vue-treeselect组件所以与PC端不同代码，注意不能直接替换
		name: "f2bpm-droptree",
		props: ['field', 'fieldvalue'],
		components: {},
		watch: {
			value(val, oleV) {
				var that = this;
				if (val != undefined && oleV != undefined && f2grid_global_mainVueLoadComplated) {
					this.$emit('updatevalue', that.field, val);
					that.triggerFieldLinkages(that.field, val);
				}
			},
			fieldvalue: {
				handler(newV, oleV) {
					var that = this;
					if (newV != undefined && oleV != undefined && f2grid_global_mainVueLoadComplated) {
						that.value = newV;
					}
				},
				immediate: false
			}
		},
		created: function() {
			var that = this;
			that.value = that.fieldvalue;
			if (that.fieldvalue == '') {
				that.value = null;
			}
			var formAction = WFContext.WorkflowformAction;
			that.isView = formAction > 2;
			that.loadTreeData();
			if (that.value) {
				that.checkedKeys.push(that.value);
			}
			if (that.isView) {
				that.isReadOnly = true;
			} else if (that.field._isReadOnly == true) {
				that.isReadOnly = true;
			}
		},
		mounted() {
			var that = this;
			if (that.value) {
				//找到对应的选项，获取它的名称
				that.showLabelOfValue();
			}
			//FUI.F2Grid.excuteFieldWritePowerByVueFormItem(that);
			if (that.value != null && that.value != undefined) {
				//触发控件联动
				that.triggerFieldLinkages(that.field, that.value);
			}
		},
		data: function() {
			return {
				checkedKeys: [],
				treeModelValue: [],
				treeKey: "001",
				//显示名称
				mineStatus: "",
				defaultProps: {
					children: "children",
					label: "title"
				},
				treeData: [],
				isView: false,
				isShow: true,
				isReadOnly: false,
				isMultiple: false,
				option_temp: null,
				value: ""
			}
		},
		methods: {
			loadTreeData() {
				var that = this;
				if (WFContext.isDesign == true) {
					return false;
				}
				if (that.field.inputCtrlOption) {
					var json = typeof that.field.inputCtrlOption == "object" ? that.field.inputCtrlOption : eval("(" + that
						.field.inputCtrlOption + ")");
					if (json.type == 'dataService') {
						var code = json.data.code;
						var isMulti = json.data.isMulti;
						var bindFields = json.data.data;
						that.isMultiple = isMulti;
						//高级参数格式：[{'key':'A','value':'1','orderNum':1},{'key':'B','value':'Items2','orderNum':2}]
						var parmsArr = json.data.parms || [];
						if (parmsArr && typeof parmsArr == "string") {
							parmsArr = eval("(" + parmsArr + ")");
						}
						var parms = {};
						if (parmsArr && parmsArr.length > 0) {
							$.each(parmsArr, function(i, item) {
								parms[item.key] = item.value;
							});
						}
						var res = FUI.Sys.getServiceData(code, parms);
						var textValueData = [];
						var data = [];
						if (res.success != undefined && res.success == true) {
							data = res.data;
						} else if (res.success == undefined) {
							data = res;
						}
						if (data && typeof data == "string") {
							data = eval("(" + data + ")");
						}
						//返回标准的tree结构数据
						textValueData = data;
						that.treeData = textValueData;
					}
				}
			},
			showLabelOfValue() {
				var that = this;
				let res = this.$refs.tree.getCheckedNodes(false, true);
				let arrLabel = [];
				let arrIds = [];
				res.forEach(item => {
					if (arrLabel.length === 0) {
						arrLabel.push(item.name);
						arrIds.push(item.id);
					} else {
						arrLabel.length === 0;
						arrIds.length === 0;
					}
				});
				this.value = arrIds.toString();
				this.mineStatus = arrLabel.toString();
			},
			handleCheckChange(data, checked, node) {
				//true，1. 是否只是叶子节点 2.选择的时候不包含父节点）
				if (checked) {
					this.$refs.tree.setCheckedNodes([data]);
				}
				this.showLabelOfValue();
			}
			//触发控件联动
			,
			triggerFieldLinkages(field, value) {
				var that = this;
				if (WFContext.isDesign == true) {
					return false;
				}
				FUI.F2Grid.excuteTriggerFieldLinkages(field, value, that.isView);
			}
		}
	};
</script>
